import _ from 'lodash';
import { COLOR_MAP, getTableData } from '../helper';

export const selfList = [
  'spotInformationTieLine',
  'releaseSectionPowerForecast',
  'operationRealtimePowerFlow',
  'realTimeOutputOfTheUnit',
  'zoneElectricityPrice',
];
/**
 * 返回所有图表配置&表格数据
 * @param {*} data 数据 { name: '我是一条线', data: [], key }
 * @param {array} datetimes 点位
 * @param {string} key 数据标识
 * @param {number} isRevised 修正前1、修正后0
 * @param {string} stationName 场站名称
 * @param {array} tableKeys 表格用到的数据键
 * @returns 所有图表配置、表格数据
 */
export const fmtData = ({ dataMap, datetimes, isRevised, stationName, chartKeys, tableKeys }) => {
  let charts = {};
  // 整理图表配置
  chartKeys.map((key) => {
    let dataList = dataMap?.[key] || [];
    // 系列
    const series = dataList?.map((x) => ({
      ...(COLOR_MAP[x.lineType] || { type: 'line' }),
      name: x.lineName || '',
      data: _.flatten(
        Object.values(x.pointData).map((y) =>
          y.map((z) =>
            isNaN(z.value)
              ? z.value
              : parseFloat(z.value).toFixed(x.lineType?.includes('电价') ? 2 : 3),
          ),
        ),
      ),
    }));
    if (key === 'spotInformationTieLine') {
      series.sort((t) => (t.name.includes('合计') ? -1 : 1));
    }
    charts[key] = {
      series,
      grid: { top: 12, left: 48, bottom: 72, right: 10 },
      tooltip: {},
      legend: {
        textStyle: {
          color: getCssVariableValue('--chart-legend-color'),
        },
      },
      dataZoom: [
        {
          type: 'slider',
          bottom: 26,
          start: 0,
          end: 100,
          height: 20,
          show: true,
          backgroundColor: getCssVariableValue('--bg-form'),
          dataBackground: {
            dataBackground: {
              areaStyle: { opacity: 0 },
              lineStyle: { opacity: 0 },
            },
          },
          selectedDataBackground: {
            areaStyle: {
              color: getCssVariableValue('--font-primary'),
              opacity: 0.15,
            },
            lineStyle: { color: 'transparent' },
          },
          borderColor: 'transparent',
          handleStyle: {
            color: getCssVariableValue('--bg-form'),
            borderColor: getCssVariableValue('--bd'),
          },
          brushSelect: false,
          showDetail: false,
        },
      ],
      xAxis: [
        {
          type: 'category',
          data: datetimes,
          axisLabel: {
            color: getCssVariableValue('--chart-font-color'),
          },
          axisLine: {
            lineStyle: {
              type: 'solid',
              color: getCssVariableValue('--chart-x-line'),
            },
          },
        },
      ],
      yAxis: [
        {
          type: 'value',
          axisLabel: {
            color: getCssVariableValue('--chart-font-color'),
          },
          axisTick: {
            lineStyle: {
              color: getCssVariableValue('--chart-y-line'),
            },
          },
        },
      ],
    };
  });
  // 整理表格数据
  const tableData = getTableData({
    charts,
    stationName,
    tableKeys,
  });
  return {
    charts,
    tableData,
  };
};
